# invalid %-encoding with file upload

**URL:** <https://discourse.hanakai.org/t/invalid-encoding-with-file-upload/1011>\
**Category:** questions\
**Created:** [August 5, 2024, 9:53pm UTC](https://discourse.hanakai.org/t/invalid-encoding-with-file-upload/1011 "2024-08-05T21:53:31Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![joeradtke](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.hanakai.org/joeradtke/32/744_2.png) [@joeradtke](https://discourse.hanakai.org/u/joeradtke)\
**Post date:** [August 5, 2024, 9:53pm UTC](https://discourse.hanakai.org/t/invalid-encoding-with-file-upload/1011/1 "2024-08-05T21:53:31Z")

</div>

Trying to upload an image and attach to relation using shrine. When I submit the form I get an invalid %-encoding error from Rack::QueryParser::InvalidParameterError. Can create an entity when I skip the file upload input and just use the other inputs.  
Trying to use the Rack::UTF8Sanitizer but I can’t get it to run before the Query Parser. Config.middleware use makes it run after the QueryParser. I tried using prepend which the docs claim would make it run first but I get an undefined method “prepend” error when I try it.

---

<div class="post-metadata">

**Author:** ![timriley](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.hanakai.org/timriley/32/621_2.png) [@timriley](https://discourse.hanakai.org/u/timriley)\
**Post date:** [August 6, 2024, 11:23am UTC](https://discourse.hanakai.org/t/invalid-encoding-with-file-upload/1011/2 "2024-08-06T11:23:15Z")

</div>

Hi @joeradtke, I’d be happy to take a look into this, but it would be useful if you could provide a reproduction of the issue. Can you make a small sample app, or at bare minimum, share some of the relevant code? That would include things like your form markup, the action, plus any relevant action or app config.

---

<div class="post-metadata">

**Author:** ![joeradtke](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.hanakai.org/joeradtke/32/744_2.png) [@joeradtke](https://discourse.hanakai.org/u/joeradtke)\
**Post date:** [August 6, 2024, 2:04pm UTC](https://discourse.hanakai.org/t/invalid-encoding-with-file-upload/1011/3 "2024-08-06T14:04:23Z")

</div>

![image](https://canada1.discourse-cdn.com/flex030/uploads/hanamirb/original/1X/10d610af2656518d5029d619343acd1a569297b3.png)

APP\>RB

# frozen\_string\_literal: true

require “hanami”  
require “warden”

module H22  
class App \< Hanami::App  
require\_relative ‘../app/middlewares/handle\_bad\_encoding\_middleware.rb’  
require “rack/utf8\_sanitizer”  
config.actions.sessions = :cookie, {  
key: “libus.session”,  
secret: settings.session\_secret,  
expire\_after: 60_60_24\*365  
}  
config.middleware.use Rack::UTF8Sanitizer,strategy: :replace\_string  
config.middleware.use Warden::Manager do |manager|  
manager.default\_strategies :password  
manager.failure\_app =  
lambda do |env|  
H22::Actions::AuthFailure::Show.new.call(env)  
end  
end

end  
end

FORM

## new page
\<%= form\_for :page, routes.path(:pages\_create) do |f| %\> 
 \<%= f.label "Name", for: :name %\> \<%= f.text\_field :name %\> 

 \<%= f.label "Title", for: :title %\> \<%= f.text\_field :title %\> 

 \<%= f.label "Body", for: :body %\> \<%= f.text\_area :body %\> 

 \<%= f.label "Image", for: :image %\> \<%= f.file\_field :image %\> 

 \<%= f.submit "SAVE PAGE" %\> 
\<%end%\>

CREATE ACTION

# frozen\_string\_literal: true

module H22  
module Actions  
module AdminPages  
class Create \< H22::AdminAction  
include Deps[pages\_repo: “repositories.pages”]

```
    params do
      required(:page).hash do
        required(:name).filled(:string)
        required(:title).filled(:string)
        required(:body).filled(:string)
        optional(:file)
      end
    end
    
    def handle(request, response)
      if pages_repo.name_taken?(request.params[:page][:name])
        halt 422, { errors: "This name is already taken" }.to_json
      end
      
      if request.params.valid?
        pages_repo.create(
          name: request.params[:page][:name],
          title: request.params[:page][:title],
          body: request.params[:page][:body],

        )
        
        response.flash[:notice]="Page saved!"
        response.redirect_to("/admin/pages") 
      else
        errors=request.params.errors
        halt 422
      end
    end
  end
end

```

end  
end

I haven’t hooked up much of the Shrine stuff yet as I can’t even get the app to accept my file input.  
I’ve been trying to use the Rack::UTF8Sanitizer to run first in the middleware stack but have been unable to do so.If I add the before: to get it first in the stack I get an uninitialized constant error for DRY::MONITOR which is the first item in the stack.

I don’t think many people are using files with Hanami as I was only able to find one article about it and its pretty specialized.

---

<div class="post-metadata">

**Author:** ![timriley](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.hanakai.org/timriley/32/621_2.png) [@timriley](https://discourse.hanakai.org/u/timriley)\
**Post date:** [August 6, 2024, 2:05pm UTC](https://discourse.hanakai.org/t/invalid-encoding-with-file-upload/1011/4 "2024-08-06T14:05:57Z")

</div>

Thanks @joeradtke. I’ll take a look when I can. In the meantime, could you please use the Discourse formatting syntax so your posts are more readable? It’s very hard to understand things in the current state.

---

<div class="post-metadata">

**Author:** ![joeradtke](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.hanakai.org/joeradtke/32/744_2.png) [@joeradtke](https://discourse.hanakai.org/u/joeradtke)\
**Post date:** [August 6, 2024, 5:34pm UTC](https://discourse.hanakai.org/t/invalid-encoding-with-file-upload/1011/5 "2024-08-06T17:34:57Z")

</div>

I’m not aware of the Discourse formatting syntax. I’ll try to figure out what it is.

Sorry

---

<div class="post-metadata">

**Author:** ![timriley](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.hanakai.org/timriley/32/621_2.png) [@timriley](https://discourse.hanakai.org/u/timriley)\
**Post date:** [August 7, 2024, 12:24am UTC](https://discourse.hanakai.org/t/invalid-encoding-with-file-upload/1011/6 "2024-08-07T00:24:35Z")

</div>

> [@joeradtke](#):
>
> I’m not aware of the Discourse formatting syntax. I’ll try to figure out what it is.

Thanks for this, @joeradtke. Some pointers:

- [Formatting posts using markdown, BBCode, and HTML](https://meta.discourse.org/t/formatting-posts-using-markdown-bbcode-and-html/239348)
- [Posting code or preformatted text](https://meta.discourse.org/t/posting-code-or-preformatted-text/188910)
- [Selecting the programming language used in code blocks](https://meta.discourse.org/t/selecting-the-programming-language-used-in-code-blocks/19247?silent=true)

If you’re familiar with the kind of [Markdown](https://www.markdownguide.org/basic-syntax/) you would write into GitHub issues/comments, it’s basically just that.

---

<div class="post-metadata">

**Author:** ![joeradtke](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.hanakai.org/joeradtke/32/744_2.png) [@joeradtke](https://discourse.hanakai.org/u/joeradtke)\
**Post date:** [August 7, 2024, 3:53am UTC](https://discourse.hanakai.org/t/invalid-encoding-with-file-upload/1011/7 "2024-08-07T03:53:35Z")

</div>

I’m not familar with Markdown.

I think I know what the problem is… It appears that the Rack Parser is only loaded if you have json output on an action. I used some article to make some of this stuff and have json outputs for some of the error handling. I guess the Parser is parsing my file. If I didn’t have the Rack Parser I’d probably be ok. Do you know if removing the json stuff would make the Rack Parser go away or do I have to start over?

---

<div class="post-metadata">

**Author:** ![joeradtke](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.hanakai.org/joeradtke/32/744_2.png) [@joeradtke](https://discourse.hanakai.org/u/joeradtke)\
**Post date:** [August 7, 2024, 4:26pm UTC](https://discourse.hanakai.org/t/invalid-encoding-with-file-upload/1011/8 "2024-08-07T16:26:34Z")

</div>

I’ve isolated the problem. If I use the helper form\_for with a file\_input I get the error. If I just make a html form without the helper I can submit a file with no parsing error. I guess the solution for now is to not use the form helper.

Incidentally, when you create a hanami app now it uses hanami 2.2beta with sqllite. If you try to use mysql2 as the database you get an error that there is no sequel adapter for mysql2.