首先在前端页面显示
.tiff格式的图片，时间问题（自己菜），不可能自己造轮子，找到第三方库
1、找第三方库
我们可以找到TiffGithub仓库,阅读READ.MD文件。
这里有如下使用案例：
// Usage
// [](https://github.com/seikichi/tiff.js#browser)Browser
// Download tiff.min.js and load the script by yourself:
var xhr = new XMLHttpRequest();
xhr.responseType = 'arraybuffer';
xhr.open('GET', "url/of/a/tiff/image/file.tiff");
xhr.onload = function (e) {
var tiff = new Tiff({buffer: xhr.response});
var canvas = tiff.toCanvas();
document.body.append(canvas);
};
xhr.send();
2、尝试使用上述demo
首先尝试在Angular6中引入tiff.js文件。
- 方式一（凉凉）：
尝试按照通常的方式：
npm install tiff
成功下载，然后，在ts文件中：
import * as Tiff from 'tiff'
....
....
ngOninit(){
var xhr = new XMLHttpRequest();
xhr.responseType = 'arraybuffer';
xhr.open('GET', "url/of/a/tiff/image/file.tiff");
xhr.onload = function (e) {
var tiff = new Tiff({buffer: xhr.response});
var canvas = tiff.toCanvas();
document.body.append(canvas);
};
xhr.send();
}
毫无疑问，凉凉，控制台报错，反正就是引进不成功。
fuck....
give color see see!是时候展示真正的技术了！
- 方式二（成功）：
接下来，我们用最最原始的方式：）
抛开框架，我们就用<script>方式。
不过，一般在angular.json中将下载好的*.min.js放在script的属性中，像这样：
"scripts": [
"src/assets/js/tiff.min.js"
]
然后，在ts中使用：
declare var Tiff: any
重启服务，就可以愉快的使用上述demo了。
3、总结一下：
其实，Angular虽然使用的是typescript，在启动服务的时候或打包之后，都会编译成普通的js，所以一般js库能很容易引入到angular框架中使用。
引入方式：
1、
npm install xxx+import * as ... from 'xxx',这种方式容易控制版本更替。一般推荐这种方式。2、下载打好的包的
.js或.min.js文件，在<script>标签中引入本地文件，或者放在angular.json的script中，然后ts中declare var xxx:any。3、远程（如cdn）引入，然后
ts中declare var xxx:any
