在laravel vapor签名存储url中使用Axios默认值
使用Tymon jwt令牌进行身份验证。拉威尔工作得很好 当使用Laravel vapor的上传到S3代码时,我无法获取签名存储url以使用我的axios默认值:在laravel vapor签名存储url中使用Axios默认值,laravel,vue.js,axios,laravel-vapor,Laravel,Vue.js,Axios,Laravel Vapor,使用Tymon jwt令牌进行身份验证。拉威尔工作得很好 当使用Laravel vapor的上传到S3代码时,我无法获取签名存储url以使用我的axios默认值: axios.defaults.headers.common[“Authorization”]=“Bearer”+令牌 存储方式如单据所示: Vapor.store(this.$refs.file.files[0], { progress: progress => { this.uploadProgress
axios.defaults.headers.common[“Authorization”]=“Bearer”+令牌代码>
存储方式如单据所示:
Vapor.store(this.$refs.file.files[0], {
progress: progress => {
this.uploadProgress = Math.round(progress * 100);
}
}).then(response => {
...
它在npm包的index.js中调用:
async store(file, options = null) {
// want this to use my default header.
const response = await axios.post('/vapor/signed-storage-url', {
'bucket': options.bucket || '',
'content_type': options.contentType || file.type,
'expires': options.expires || ''
});
可能与npm模块不在正确的范围内有关
我已经覆盖了vapor core签名存储url控制器以使用令牌,并且可以让它正常工作,这对Postman没有问题。
它正在调用Vapor.store,它没有将令牌添加到axios调用中,而且我看不到传递头的方法
编辑:您无需注册Vapor即可使用这些软件包
composer require laravel/vapor-core
及
已解决
因此,为了实现这一点,我将async store方法复制到我的vue组件方法中,并从那里调用它。获取默认标题,但
这导致S3出现axios标头问题,通过执行以下操作可以解决此问题:
async store(file, options = null) {
const response = await axios.post('/vapor/signed-storage-url', {
'bucket': options.bucket || '',
'content_type': options.contentType || file.type,
'expires': options.expires || ''
});
if (typeof options.progress === 'undefined') {
options.progress = () => {};
}
// This is the fix for the headers. Instance just for the S3 PUT
var instance = axios.create();
instance.defaults.headers.common = {};
const s3Response = await instance.put(response.data.url, file, {
headers: response.data.headers,
onUploadProgress: (progressEvent) => {
options.progress(progressEvent.loaded / progressEvent.total);
}
});
response.data.extension = file.name.split('.').pop()
return response.data;
},
多亏了解决了
因此,为了实现这一点,我将async store方法复制到我的vue组件方法中,并从那里调用它。获取默认标题,但
这导致S3出现axios标头问题,通过执行以下操作可以解决此问题:
async store(file, options = null) {
const response = await axios.post('/vapor/signed-storage-url', {
'bucket': options.bucket || '',
'content_type': options.contentType || file.type,
'expires': options.expires || ''
});
if (typeof options.progress === 'undefined') {
options.progress = () => {};
}
// This is the fix for the headers. Instance just for the S3 PUT
var instance = axios.create();
instance.defaults.headers.common = {};
const s3Response = await instance.put(response.data.url, file, {
headers: response.data.headers,
onUploadProgress: (progressEvent) => {
options.progress(progressEvent.loaded / progressEvent.total);
}
});
response.data.extension = file.name.split('.').pop()
return response.data;
},
多亏了为什么这需要经过身份验证的路由呢?@AliGajani所以我的S3存储桶不适用于所有人。只有已登录的用户才能上载图像。您是否必须定义vapor/signed storage url
或它是预安装的?signed storage url是vapor core的一部分。我需要覆盖它,以便将上传设置为公共阅读。app/overrides/src/Controllers/SignedStorageUrlController.phpVapor-core已更新以设置可见性。是否查看此提交?为什么仍需要在经过身份验证的路由下执行此操作?@AliGajani因此我的S3存储桶不可供所有人使用。只有已登录的用户才能上载图像。您是否必须定义vapor/signed storage url
或它是预安装的?signed storage url是vapor core的一部分。我需要覆盖它,以便将上传设置为公共阅读。app/overrides/src/Controllers/SignedStorageUrlController.phpVapor-core已更新为设置可见性。请参阅此提交