vue中img使用网络地址src，https、http均显示不出图片，一行代码解决

最新推荐文章于 2023-09-27 10:40:30 发布

宁长风

最新推荐文章于 2023-09-27 10:40:30 发布

阅读量1.3w

点赞数 6

分类专栏： Vue 文章标签： vue html

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文链接：https://blog.csdn.net/weixin_43663775/article/details/109595821

版权

Vue 专栏收录该内容

23 篇文章 0 订阅

订阅专栏

<!--vue中使用-->
<img 
src="https://img.ivsky.com/img/tupian/pre/202004/18/hongchanhua-001.jpg" 
alt="" style="width: 100%;height: 300px">
<!--图片不显示-->

在public中的html中，header内加上:

<meta name="referrer" content="no-referrer">

即可，一种策略，原理没大明白，有知道的大佬望指教
如果对你有帮助，点个赞，收藏一下吧~~~~~~~~~~~~

关注

6
点赞
踩
20

收藏

觉得还不错? 一键收藏
11
评论
vue中img使用网络地址src，https、http均显示不出图片，一行代码解决

<img src="https://img.ivsky.com/img/tupian/pre/202004/18/hongchanhua-001.jpg" alt="" style="width: 100%;height: 300px">在public中的html中，header内加上:<meta name="referrer" content="no-referrer">即可，一种策略，原理
复制链接

扫一扫

专栏目录

宁长风 CSDN认证博客专家 CSDN认证企业博客

码龄5年

97: 原创

9万+: 周排名

130万+: 总排名

9万+: 访问

: 等级

1169: 积分

7: 粉丝

73: 获赞

48: 评论

137: 收藏

私信

关注

热门文章

分类专栏

正则表达式 1篇
git 6篇
javascript 12篇
css3 9篇
问题专栏bug 1篇
Vue 23篇
算法 3篇
jquery 1篇
webgl 3篇
canvas 1篇
java自学 24篇
rust 2篇
电脑文件夹操作 1篇
iframe 1篇
vscode-tools 3篇
node 3篇
windows下载scoop、
window下载scoop
mysql 1篇
http 1篇
axios
mongodb 1篇
linux 1篇
nginx 1篇

最新评论

简单易懂，终于搞明白怎么用nginx在vue开发环境中跨域了，详细
无双渐离: config [code=javascript] server { listen 8083; server_name localhost; location /apc { proxy_pass http://localhost:3000/apc; # proxy_pass http://127.0.0.1:5174; } location / { proxy_pass http://localhost:5174; } } [/code] vue 页面 [code=javascript] import axios from "axios" function fun() { getData() function getData() { console.log("请求33成功") axios.get(" apc/getbook").then(res=> { // axios.get("/apc/maps/contrib/103247527174707148181").then(res=> { console.log("请求成功",res.data) }).then(err => { console.log("请求失败") }) } function saveData(result) { axios({ method: 'put', //请求方式，默认是get请求 url: '/add', //地址 data: result }).then(res => { console.log('poi保存成功') }).catch(err => { console.error(err) }) } } [/code]
简单易懂，终于搞明白怎么用nginx在vue开发环境中跨域了，详细
无双渐离: 好像没有拦截
简单易懂，终于搞明白怎么用nginx在vue开发环境中跨域了，详细
无双渐离: nodejs服务 [code=javascript] const http = require("http") const port = process.env.PORT || 3000; const server = http.createServer((req, res) => { res.statusCode = 200; res.setHeader('Content-type', 'application/json; charset=utf8') // res.end('hello World'); }); server.listen(port, () => { console.log(`服务开启：${port}`) }) function note() { console.log("nodejs") } server.on('request', function (req, res) { // req.url 请求地址中的路径（端口后的部分） // res.method 客户端请求的方式（GET\POST\PUT\DELETE） if (req.url === '/getbook' && req.method === 'GET') { res.end('nodejs返回成功！') } }) note() [/code]
简单易懂，终于搞明白怎么用nginx在vue开发环境中跨域了，详细
无双渐离: [code=javascript] server { listen 8083; server_name localhost; location /apc { proxy_pass http://localhost:3000; # proxy_pass http://127.0.0.1:5174; } location / { proxy_pass http://localhost:5174; } } [/code] 页面 [code=javascript] import axios from "axios" function fun() { getData() function getData() { console.log("请求33成功") axios.get("/apc/getbook").then(res=> { // axios.get("/apc/maps/contrib/103247527174707148181").then(res=> { console.log("请求成功",res.data) }).then(err => { console.log("请求失败") }) } function saveData(result) { axios({ method: 'put', //请求方式，默认是get请求 url: '/add', //地址 data: result }).then(res => { console.log('poi保存成功') }).catch(err => { console.error(err) }) } } [/code] nodejs服务
简单易懂，终于搞明白怎么用nginx在vue开发环境中跨域了，详细
宁长风: 看看有没有报错啊

您愿意向朋友推荐“博客详情页”吗？

强烈不推荐
不推荐
一般般
推荐
强烈推荐

提交

最新文章

目录

评论 11

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。