pbl-teacher-table/src/components/pages/pocAi/component/txtView.vue

<template>
  <div class="txtView" v-loading="loading">
		<div class="tv_content" v-text="content"></div>
	</div>
</template>

<script>
import "../../../../common/aws-sdk-2.235.1.min.js";

const getFile = url => {
  return new Promise((resolve, reject) => {
    var credentials = {
      accessKeyId: "AKIATLPEDU37QV5CHLMH",
      secretAccessKey: "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"
    }; //秘钥形式的登录上传
    window.AWS.config.update(credentials);
    window.AWS.config.region = "cn-northwest-1"; //设置区域
    let url2 = url;
    let _url2 = "";
    if (
      url2.indexOf("https://view.officeapps.live.com/op/view.aspx?src=") != -1
    ) {
      _url2 = url2.split(
        "https://view.officeapps.live.com/op/view.aspx?src="
      )[1];
    } else {
      _url2 = url2;
    }
    var s3 = new window.AWS.S3({ params: { Bucket: "ccrb" } });
    let name = decodeURIComponent(
      _url2.split("https://ccrb.s3.cn-northwest-1.amazonaws.com.cn/")[1]
    );
    var params = {
      Bucket: "ccrb",
      Key: name
    };
    s3.getObject(params, function(err, data) {
      if (err) {
        console.log(err, err.stack);
        resolve({ data: 1 });
      } else {
        const fileContent = data.Body.toString("utf-8");
        resolve({ data: fileContent });
      } // sxuccessful response
    });
    // axios({
  });
};
export default {
  props: {
    url: {
      type: String,
      default: ""
    },
  },
	data(){
		return{
			content:"",
			loading:""
		}
	},
	methods: {
		getTxtContent() {
			if(!this.url)return;
			this.loading = true;
			getFile(this.url).then(res=>{
				this.loading = false;
				this.content = res.data;
			})
		},
	},
	mounted(){
		this.getTxtContent();
	}
};
</script>

<style scoped>
.txtView{
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	background-color: #ececec;
	padding: 20px;
}

.tv_content{
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	background-color: #fff;
	overflow: auto;
	word-wrap: break-word;
	border-radius: 3px;
	white-space: pre;
}
</style>