首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >Uppy + Laravel不能上传文件

Uppy + Laravel不能上传文件
EN

Stack Overflow用户
提问于 2020-01-09 10:03:30
回答 2查看 1K关注 0票数 1

试图使用Uppy通过Laravel上传文件。设置简单的上传表单,并使用params:

代码语言:javascript
运行
复制
const options = {
    endpoint: '/parts/image-upload',
    headers: {
        'X-XSRF-TOKEN': $('meta[name="csrf-token"]').attr('content'),
    },
};

uppyDashboard.use(XHRUpload, options);

在后端我得到了

Illuminate\Contracts\Encryption\DecryptException: The payload is invalid. in file /Users/rd/Projects/xxx/vendor/laravel/framework/src/Illuminate/Encryption/Encrypter.php on line 195

这就像拉勒维尔试图解密一些已经解密的东西,无论如何,我处于死胡同。

EN

回答 2

Stack Overflow用户

发布于 2022-09-01 07:57:05

你能把这段代码

代码语言:javascript
运行
复制
 var uppy = new Uppy.Core({
                // debug: (...args) => console.debug(`[Uppy] [${getTimeStamp()}]`, ...args),
                // warn: (...args) => console.warn(`[Uppy] [${getTimeStamp()}]`, ...args),
                // error: (...args) => console.error(`[Uppy] [${getTimeStamp()}]`, ...args),
                autoProceed: true,
                restrictions: {
                    maxFileSize: 2000000,
                    maxNumberOfFiles: 10,
                    minNumberOfFiles: 1,
                    allowedFileTypes: ['image/*']
                }
            });
            uppy.use(Uppy.Dashboard, {
                target: ".UppyDragDrop",
                inline: true,
                showLinkToFileUploadResult: false,
                showProgressDetails: true,
                hideCancelButton: true,
                hidePauseResumeButton: true,
                hideUploadButton: true,
                proudlyDisplayPoweredByUppy: false,
                locale: {}  });
票数 0
EN

Stack Overflow用户

发布于 2022-10-17 13:48:41

下面是我实现它的方法

代码语言:javascript
运行
复制
<script type="text/javascript">
$(document).ready(function() {
$('[id*=drag-drop-area]').each(function(){

var listing_id = $(this).attr('class');

var uppy = new Uppy.Core({
allowMultipleUploadBatches: true,
restrictions: {
maxFileSize: 100000000,
// maxNumberOfFiles: 8,
minNumberOfFiles: 1,
allowedFileTypes: ['image/*', '.jpg', '.jpeg', '.png']
}
})
.use(Uppy.Dashboard, {
inline: true,
target: "#"+$(this).attr('id')+""
})
.use(Uppy.XHRUpload, {
endpoint: 'upload',
formData: true,
bundle: true,
headers: {
'X-CSRF-Token': " {{ csrf_token() }} "
},
});

uppy.on('upload-success', (file, response) => {
response.body.data.forEach(function (item, index) {
console.log(listing_id);
var token = 
$('meta[name="csrftoken"]').attr('content');

$.ajax({
url: 'attach',
type: 'POST',
data: { '_token' : token, item, listing_id},
success: function(response) 
{
console.log('Updated');
},
error:function (e) {
console.log(e);
}
});
});
window.location.reload();
});
});
});
</script>

创建端点,这是路由名称,并附加在

端点:"“

然后你返回一个回应,你抓住它,做最后一节的任何事情。

代码语言:javascript
运行
复制
uppy.on('upload-success', (file, response) => {
response.body.data.forEach(function (item, index) {
console.log(listing_id);
var token = 
 $('meta[name="csrftoken"]').attr('content');

$.ajax({
url: 'attach',
type: 'POST',
data: { '_token' : token, item, listing_id},
success: function(response) 
{
    console.log('Updated');
},
error:function (e) {
    console.log(e);
}
});
});
window.location.reload();
});

我希望这能帮到你

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/59661489

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档